<%@ page language="java" contentType="text/html; charset=UTF-8"
	isELIgnored="false"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<base href="${ctx}">
<title>我的已办事务</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<link type="text/css" media="screen" charset="utf-8" rel="stylesheet" href="${ctx}/commons/css/common.css" />
<link type="text/css" media="screen" charset="utf-8" rel="stylesheet" href="${ctx}plugins/fancybox-1.3.4/jquery.fancybox-1.3.4.css" />
<script language="javascript" type="text/javascript" src="${ctx}plugins/datepicker/WdatePicker.js"></script>
<script type="text/javascript" src="${ctx}plugins/jquery/jquery-1.7.min.js"></script>
<script type="text/javascript" src="${ctx}plugins/fancybox-1.3.4/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript" src="${ctx}plugins/fancybox-1.3.4/jquery.fancybox-1.3.4.pack.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
		if('${login}')
			alert('${login}');
		//鼠标经过时结果行背景变色
		$(".tb-table>table tr:gt(0)").hover(function() {
			$(this).css("background", "#EEEEEE");
		}, function() {
			$(this).css("background", "");
		});
		$("#showInstance").fancybox({
			'margin'		: 0,
			'width' 		: '80%',
			'height' 		: '90%',
			'autoScale' 	: false,
			'transitionIn' 	: 'none',
			'transitionOut' : 'none',
			'type' 			: 'iframe',
		});
	});
	function showAffair(requestPath,affairNo){
		if(Boolean(requestPath) && Boolean(affairNo)){
			var obj = $("#showInstance");
			obj.attr("href",requestPath + affairNo);
			obj.trigger("click");
		}
	}
	function showInstance(instanceNo){
		if(Boolean(instanceNo)){
			var obj = $("#showInstance");
			obj.attr("href","${ctx}dispatcher.htm?action=SHOW&instanceNo=" + instanceNo);
			obj.trigger("click");
		}
	}
	function resetOPT(){
		$("#affairTypeCode").val("");
		$("#flowCode").val("");
		$("#status").val("");
		$("#affairNo").val("");
		$("#createStartDate").val("");
		$("#createEndDate").val("");
		$("#completStartDate").val("");
		$("#completEndDate").val("");
	}
</script>
</head>
<body>
	<div class="tb-table">
		<form id="formId" action="historyOfMe.htm" method="POST">
			<input type="hidden" id="currentPage" name="currentPage" value="1" />
			<table>
				<tr>
					<th>事务类型：</th>
					<td><select id="affairTypeCode" name="affairTypeCode"
						class="i-select">
							<option value="">全部</option>
							<c:if test="${atMap != null }">
								<c:forEach var="at" items="${atMap }">
									<option value="${at.key}"
										<c:if test="${form.affairTypeCode eq at.key}">selected="selected"</c:if>>${at.value.typeName}</option>
								</c:forEach>
							</c:if>
					</select></td>
					<th>所属流程：</th>
					<td><select id="flowCode" name="flowCode" class="i-select">
							<option value="">全部</option>
							<c:if test="${flowJSON != null }">
								<c:forEach var="flow" items="${flowJSON }">
									<option value="${flow.key}"
										<c:if test="${form.flowCode eq flow.key}">selected="selected"</c:if>>${flow.value}</option>
								</c:forEach>
							</c:if>
					</select></td>
					<th>启动时间：</th>
					<td><input type="text" id="createStartDate" name="createStartDate" class="Wdate" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd'})"
						value="${form.createStartDate }" readonly="readonly" /> -- 
						<input type="text" id="createEndDate" name="createEndDate" class="Wdate" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd'})"
						value="${form.createEndDate }" readonly="readonly" /></td>
				</tr>
				<tr>
					<th>事务编号：</th>
					<td><input type="text" class="i-text" id="affairNo" name="affairNo" value="${form.affairNo}" /></td>
					<th>事务状态：</th>
					<td><select id="status" name="status" class="i-select">
							<option value="">全部</option>
							<option value="0" <c:if test="${48 eq form.status }">selected="selected"</c:if>>受阻</option>
							<option value="1" <c:if test="${49 eq form.status }">selected="selected"</c:if>>运行中</option>
							<option value="2" <c:if test="${50 eq form.status }">selected="selected"</c:if>>已完成</option>
					</select></td>
					<th>完成时间：</th>
					<td><input type="text" id="completStartDate" name="completStartDate" class="Wdate" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd'})"
						value="${form.completStartDate }" readonly="readonly" /> -- 
						<input type="text" id="completEndDate" name="completEndDate" class="Wdate" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd'})"
						value="${form.completEndDate }" readonly="readonly" /></td>
				</tr>
				<tr>
					<td colspan="6" align="center">
						<div class="tb-tfoot-noborder">
							<span class="btn"><input type="submit" value="查&emsp;询" /></span>&emsp;
							<span class="btn"><input type="button" onclick="resetOPT()" value="重&emsp;置" /></span>
						</div>
					</td>
				</tr>
			</table>
		</form>
	</div>
	<c:if test="${pageList != null}">
		<h3 class="fn-mt7" align="center">
			<span style="font-size: 14px; font-weight: bold;">我操办事务的历史记录</span>
			<br style="height: 0; clear: both;" />
		</h3>
		<div class="tb-table">
			<table id="tab">
				<thead>
					<tr>
						<th width="30">序 号</th>
						<th>事务编号</th>
						<th>事务类型</th>
						<th>所属流程</th>
						<th>启动时间</th>
						<th>完成时间</th>
						<th>状&emsp;态</th>
						<th>查&emsp;看</th>
					</tr>
				</thead>
				<tbody>
					<c:choose>
						<c:when test="${fn:length(pageList) > 0}">
							<c:forEach var="pi" items="${pageList}" varStatus="str">
								<c:set var="atc" value="${fn:substringBefore(pi.instanceNo, ':') }"></c:set>
								<tr>
									<td align="center"><c:out value="${str.count}" /></td>
									<td align="center"><c:out value="${fn:substringAfter(pi.instanceNo, ':')}" /></td>
									<td align="center"><c:out value="${atMap[atc].typeName}" /></td>
									<td align="center">${ftJSON[atMap[atc].flowTypeCode]} ›› ${flowJSON[atMap[atc].flowCode] }</td>
									<td align="center"><fmt:formatDate value="${pi.gmtStarting}" type="both" /></td>
									<td align="center"><fmt:formatDate value="${pi.gmtCompleted}" type="both" /></td>
									<td align="center">
										<c:if test="${pi.status eq 49}">办理中</c:if>
										<c:if test="${pi.status eq 48}">未通过</c:if>
										<c:if test="${pi.status eq 50}">已完成</c:if>
									</td>
									<td align="center">
										<a href="javascript:void(0)" onclick="showAffair('${atMap[atc].requestPath}','${fn:substringAfter(pi.instanceNo, ':')}')">事务详情</a>&emsp;
										<a href="javascript:void(0)" onclick="showInstance('${pi.instanceNo}')">办理详情</a>
									</td>
								</tr>
							</c:forEach>
						</c:when>
						<c:otherwise>
							<tr>
								<td class="center" colspan="8">暂无记录</td>
							</tr>
						</c:otherwise>
					</c:choose>
				</tbody>
			</table>
		</div>
		<c:if test="${fn:length(pageList) > 0}">
			<div>
				<jsp:include page="/views/commons/paginator.jsp">
					<jsp:param name="formName" value="formId" />
					<jsp:param name="currentPage" value="currentPage" />
				</jsp:include>
			</div>
		</c:if>
	</c:if>
	<a id="showInstance" href="" style="display: none;"></a>
</body>
</html>